<template>
	<div>
		<div class="login">
			<div class="top-container">
			   <img src="../../../static/img/logo.png" class="logo" />
			   <img src="../../../static/img/smart-school.png" class="start" />
			</div>
				
			<div class="register-panel">
				<i></i>
			 	<van-field
			 		v-model="username"
			 		left-icon="contact"
			 		placeholder="请输入账号"
			 		@click-icon="username=''"
			 		/>
			 			 	
			 	<van-field
			 		v-model="password"
			 		ype="password"
			 		left-icon="contact"
			 		placeholder="请输入密码"
			 		/>
			 	<div class="register-button">
			 		<van-button type="primary" size="large">登录</van-button>
			 	</div>
			</div>
					
			   
		</div>
		
	</div>
</template>

<script>
	export default{
		data(){
			return{
				username:'',
				password:''
			}
		},
		methods:{
			axiosRegisterUser(){
				axios({
					uel:url.registerUser,
					method:'post',
					data:{
						username:this.username,
						password:this.password
					}
				})
				.then(response=>{
					console.log(response)
				})
				.catch((error)=>{
					console.log(error)
				})
			}
		},
	}
</script>

<style>
	.login{
		background-image: url(../../../static/img/bg.png);
		background-size:100%;
		background-repeat:no-repeat;
		z-index:-1;
	}
	.logo{
		 width: 75%;
         margin-top:20px;
	}
	.start{
		 width:25%;
         margin-top:20px;
	}
	.register-panel{
		 width:88%;
         height: 17.5rem;
         margin: auto;
        background-color: #fff;
         border-radius:.5rem;
         margin-top:1.875rem;
         overflow: hidden;
	}
	.van-cell{
		width:85%;
		margin:1rem auto;
	}
	.van-button{
		width:85%;
	}
	
</style>